<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%@taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>

<%String path = request.getContextPath();%>
<form action="/user/login" method="post" id="myform">

        <div class="form_text_ipt">
            <input id="name" name="name" type="text" placeholder="填写手机号">
            <span></span>
        </div>
        <div >
            <div class="form_text_ipt" style="width:130px;margin-left: 28px;float: left ">
                <input id="code" name="code"  type="text" placeholder="验证码" style="width:80px;"  >

            </div>
            <div class="form_btn" style="width: 120px;margin-left: 30px;float:left">
                <button id="getCode" type="button"  style="margin-top:10px;margin-left:20px">获取验证码</button>
            </div>
        </div>


        <div class="form_check_ipt" style="margin-top: 70px">
            <div class="left check_left">
                <label><input name="remberMe" type="checkbox"> 下次自动登录</label>
            </div>
            <div class="right check_right">
                <a href="#">忘记密码</a>
            </div>
        </div>
        <div class="form_btn">
            <button type="button" id="login">登录</button>
        </div>
        <div class="form_reg_btn">
            <span>还没有帐号？</span><a href="<%=path%>/user/registe">马上注册</a>
        </div>
</form>

<script>
    $(function () {

        $("#name").blur(checkName);
        $("#name").focus(function () {
            $("#name").next().html("");

        })
        $("#getCode").click(getCode);
        $("#myform").click(submit);

        //判断手机号是否为空以及是否注册过
        function checkName() {
            var name = $("#name").val();
            var flag = false;
            if(name==""){
                $("#name").next().html("手机号不能为空呦~");
                $("#name").next().css("color","red");
                flag = false;
                return flag;
            }
            //判断手机号格式;格式对往下走
            var text = /^1[3|4|5|7|8]\d{9}$/;
            flag = text.test(name);
            if(flag) {
                //查询是否已经注册
                $.ajax({
                    url:"<%=path%>/isRegiste",
                    async:false,
                    data:{"name":name},
                    type:"post",
                    success:function (mes) {
                        if(mes=="true")//没有查到该用户
                        {
                            flag = false;
                        }
                        if(mes=="false")//查到该用户的信息
                        {
                            flag = true;
                            $("#name").next().html("✔");
                        }
                    }
                });//ajax结束
                return flag;
            }
            else{
                $("#name").next().html("格式不对");
                flag = false;
                return flag;
            }

        }

        var time = "60";
        var timeId;
        //发送短信验证码
        function getCode() {
            var flagx = false;
            var number = $("#name").val();
            var flag = checkName();
            if(flag == true){
                var timer = setInterval(function() {
                    time--;
                    $("#getCode").html("重新获取验证码"+time+"s");
                    $("#getCode").attr("disabled",true);
                    if(time == 0) {
                        time = 60;
                        clearInterval(timer);
                        $("#getCode").html("获取验证码");
                        $("#getCode").attr("disabled",false);
                    }
                }, 1000);

                $.ajax({
                    url: "<%=path%>/sendSms",
                    async : true,
                    type: "post",
                    dataType: "json",
                    data: {"number":number},
                    success: function (data)
                    {
                        alert(data);
                        if(data == 'fail')
                        {
                            alert("发送验证码失败");
                            flagx = false;
                        }
                        alert("发送验证码成功");
                        flagx = true;
                    }
                });//ajax结束
                return flagx;
            }

        }

        //表单提交验证验证码
        function submit() {
            var flag1 = checkName();
            var code = $("#code").val();
            if(code!=""){
                if(flag1) {
                    var number = $("#name").val();
                    $.ajax({
                        url: "<%=path%>/checkCode",
                        async : true,
                        type: "post",
                        data: {"number":number,"verifyCode":code},
                        success: function (data)
                        {
                            if(data == '验证码错误')
                            {
                                alert("验证码错误");
                                return ;
                            }
                            if(data == '验证码过期')
                            {
                                alert("验证码过期");
                                return ;
                            }
                            alert("登录成功");
                            $("#myform").submit();
                            return;
                        }
                    });//ajax结束
                }
            }
        }

    })//函数结束

</script>